<template>
    <div>
        <div class="form-wrapper">
           <div class="form-table">
                <h1>个人资料信息</h1>
         <el-form :label-position="'left'" label-width="120px" >
           <el-form-item label="头像" >
                <div>
                    <img :src="userInfo.photo_url" alt="" style="width:60px;border-radius:50%;height:60px;object-fit:cover">
                </div>
            </el-form-item>
            <el-form-item label="昵称" >
                <div>{{userInfo.nickname}}</div>
            </el-form-item>
           <el-form-item label="姓名" >
             <div>{{userInfo.realname}}</div>
           </el-form-item>
            <el-form-item label="公司名称" >
                <div>{{userInfo.company_name}}</div>
            </el-form-item>
           <el-form-item label="岗位" >
             <div>{{userInfo.position}}</div>
           </el-form-item>
            <el-form-item label="联系电话" >
                <div>{{userInfo.phone}}</div>
            </el-form-item>
           <el-form-item label="电子邮箱" >
             <div>{{userInfo.email}}</div>
           </el-form-item>
            <el-form-item label="所在地区" >
                <div>{{userInfo.province}}{{userInfo.city}}{{userInfo.area}}{{userInfo.address}}</div>
            </el-form-item>
            <el-form-item label="行业" >
                <div>{{userInfo.industry}}</div>
            </el-form-item>
            <el-form-item label="注册时间" >
                <div>{{userInfo.created_at}}</div>
            </el-form-item>
           <el-form-item label="所属组" >
             <div>{{userInfo.belong_group}}</div>
           </el-form-item>
          </el-form>
           </div>

        </div>

    </div>
</template>
<script>
export default {
    data(){
        return{
            userInfo:{},
            id:'',
            tableData:''
        }
    },
    methods:{
        async getUserDetail(){
            let res=await this.$api.getUserDetail({id:this.id});
            if(res.data.level=='success'){
                this.userInfo=res.data.data
            }else{
                this.$message.error(res.data.message)
            }
        },
    },
    mounted() {
        this.id=this.$route.query.id;
        this.getUserDetail()
    },
}
</script>
<style lang="scss" scoped>
    .form-wrapper{
       display: flex;
       justify-content: center;
       width:100%;
       flex-wrap: wrap;
       .form-table{
           margin:20px;
           display: flex;
            justify-content: center;
            flex-wrap: wrap;
            width: 80%;
            border: 1px solid #eee;
            box-shadow: #eee 5px 5px 20px;
            padding:20px;
            h1{
                width: 100%;
                font-size: 24px;
                color:red;
            }
       }
    }
</style>
